<template>
	<view class="body">
		<input v-model="oldpassword" type="password" class="uni-input commom-input" placeholder="输入旧密码"/>
		<input v-model="newpassword" type="password" class="uni-input commom-input" placeholder="输入新密码"/>
		<input v-model="renewpassword" type="password" class="uni-input commom-input" placeholder="输入确认密码"/>
		
		<button @tap="submit" class="user-set-btn " 
			:class="{'user-set-btn-disable':disiabled}"
			:loading="loading"
		type="primary" :disabled="disiabled">确认修改</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				oldpassword:"",
				newpassword:"",
				renewpassword:"",
				disiabled: true,
				loading:false,
			}
		},
		watch:{
			oldpassword(val){
				this.change();
			},
			newpassword(val){
				this.change();
			},
			renewpassword(val){
				this.change();
			},
		},
		methods: {
			//监听输入框
			change(){
				if (this.oldpassword && this.newpassword && this.renewpassword) {
					this.disiabled = false;
					return;
				}
				this.disiabled = true;
			},
			// 验证层
			check(){
				if (!this.oldpassword || this.oldpassword == "") {
					uni.showToast({title: "旧密码不能为空",icon:"none"});
					return false;
				}
				if (!this.newpassword || this.newpassword == "") {
					uni.showToast({title: "新密码不能为空",icon:"none"});
					return false;
				}
				if (!this.renewpassword || this.renewpassword == "") {
					uni.showToast({title: "确认密码不能为空",icon:"none"});
					return false;
				}
				if (this.newpassword != this.renewpassword) {
					uni.showToast({title: "密码不一致",icon:"none"});
					return false;
				}
				
				return true;
			},
			//提交
			 submit(){
				 this.loading = true;
				 this.disiabled = true;
				 if (!this.check()) {
					 this.loading = false;
					 this.disiabled = false;
				 }
				 uni.showToast({title: "提交服务器", mask:false, duration:1500});
				
				 setTimeout(()=>{
					 this.loading = false;
					 this.disiabled = false;
				 } ,1500);
			 }
		}
	}
</script>

<style>
@import "../../common/form.css";
</style>
